<style>
    .g_p_type{
        display: none;
    }
    #suggestions{
        background-color: black;
        color: white;
    }
    #autoSuggestionsList{
        background-color: black;
        color: white;
    }
    .suggestionList li {
        margin: 0px 0px 0px 0px;
        padding: 3px;
        cursor: pointer;
    }
    .suggestionList li:hover {
        background-color: #659CD8;
    }
    #j1suggestions{
        background-color: black;
        color: white;
    }
    #j1autoSuggestionsList{
        background-color: black;
        color: white;
    }
    .j1suggestionList li {
        margin: 0px 0px 0px 0px;
        padding: 3px;
        cursor: pointer;
    }
    .j1suggestionList li:hover {
        background-color: #659CD8;
    }
</style>
<script language="JavaScript">
    function lookup(inputString) {
        cus=-1;
        if(inputString.length == 0) {
            // Hide the suggestion box.
            $('#suggestions').hide();
        } else {
            $.post("/admin/command/getplace", {queryString: ""+inputString+""}, function(data){
                if(data.length >0) {
                    $('#suggestions').show();
                    $('#autoSuggestionsList').html(data);
                }
            });
        }
    } // lookup
    function aa (){
        if(document.activeElement.id!="inputString"){
            if(document.activeElement.id!="inputString1"){
                setTimeout("$('#suggestions').hide();", 200);
            }
        }
    }
    function fill(obj) {
        console.log($(obj).html()+"##########");
        $('#inputString').val($(obj).html());
        $("#pinfo").html($(obj).attr("pcontent"))
        $("#info_linkid").val($(obj).attr("placeid"))
        $("#startcityid").val($(obj).attr("placeid"))
        $("#info_title").val($(obj).attr("pname"))
        $("#startcity").val($(obj).attr("pname"))
        //setTimeout("aa()",200);
    }
    function fill1(thisValue) {
        setTimeout("aa()",200);
    }
    //全局定义 当前选择的li数组下标
    var cus=-1;
    function sitem(event,obj){
//获取所有选项li
        var liarr=$("#autoSuggestionsList").find("li")
        //向上
        if (event.keyCode == 38) {
            $("#inputString1").focus();
            if(-1>cus){
                cus=liarr.length-2;
            }
            cus--;
            $("#autoSuggestionsList").find("li").css("background-color","#252525");
            $(liarr[cus]).css("background-color","#659CD8");
            $("#inputString").val($(liarr[cus]).html())
            $("#inputString1").val($(liarr[cus]).html())
        }
        //向下
        if(event.keyCode == 40){
            $("#inputString1").focus();
            if(cus>liarr.length-2){
                cus=-1;
            }
            cus++;
            $("#autoSuggestionsList").find("li").css("background-color","#252525");
            $(liarr[cus]).css("background-color","#659CD8");
            $("#inputString").val($(liarr[cus]).html())
            $("#inputString1").val($(liarr[cus]).html())
        }
        //回车
        if(event.keyCode == 13){
            console.log($(liarr[cus]).attr("placeid")+"@@@@@@@@");
            $("#inputString").val($(liarr[cus]).html())
            $("#inputString1").val($(liarr[cus]).html())
            $("#pinfo").html($(liarr[cus]).attr("pcontent"))
            $("#info_linkid").val($(liarr[cus]).attr("placeid"))
            $("#startcityid").val($(liarr[cus]).attr("placeid"))
            $("#info_title").val($(liarr[cus]).attr("pname"))
            $("#startcity").val($(liarr[cus]).attr("pname"))
            //$('#suggestions').hide();
            $("#inputString").focus();
            cus=-1;
        }
    }
    /////////////////////////////////////////////////////////
    function j1lookup(inputString) {
        j1cus=-1;
        if(inputString.length == 0) {
            // Hide the suggestion box.
            $('#j1suggestions').hide();
        } else {
            $.post("/admin/command/j1getplace", {queryString: ""+inputString+""}, function(data){
                if(data.length >0) {
                    $('#j1suggestions').show();
                    $('#j1autoSuggestionsList').html(data);
                }
            });
        }
    } // lookup
    function j1aa (){
        if(document.activeElement.id!="j1inputString"){
            if(document.activeElement.id!="j1inputString1"){
                setTimeout("$('#j1suggestions').hide();", 200);
            }
        }
    }
    function j1fill(obj) {
        console.log($(obj).html()+"##########");
        $('#j1inputString').val($(obj).html());
        $("#j1pinfo").html($(obj).attr("pcontent"))
        $("#j1info_linkid").val($(obj).attr("placeid"))
        $("#endcityid").val($(obj).attr("placeid"))
        $("#j1info_title").val($(obj).attr("pname"))
        $("#endcity").val($(obj).attr("pname"))
        //$('#j1suggestions').hide();
        //setTimeout("aa()",200);
    }
    function j1fill1(thisValue) {
        setTimeout("j1aa()",200);
    }
    //全局定义 当前选择的li数组下标
    var j1cus=-1;
    function j1sitem(event,obj){
//获取所有选项li
        var liarr=$("#j1autoSuggestionsList").find("li")
        //向上
        if (event.keyCode == 38) {
            $("#j1inputString1").focus();
            if(-1>j1cus){
                j1cus=liarr.length-2;
            }
            j1cus--;
            $("#j1autoSuggestionsList").find("li").css("background-color","#252525");
            $(liarr[j1cus]).css("background-color","#659CD8");
            $("#j1inputString").val($(liarr[j1cus]).html())
            $("#j1inputString1").val($(liarr[j1cus]).html())
        }
        //向下
        if(event.keyCode == 40){
            $("#j1inputString1").focus();
            if(j1cus>liarr.length-2){
                j1cus=-1;
            }
            j1cus++;
            $("#j1autoSuggestionsList").find("li").css("background-color","#252525");
            $(liarr[j1cus]).css("background-color","#659CD8");
            $("#j1inputString").val($(liarr[j1cus]).html())
            $("#j1inputString1").val($(liarr[j1cus]).html())
        }
        //回车
        if(event.keyCode == 13){
            console.log($(liarr[j1cus]).attr("placeid")+"@@@@@@@@");
            $("#j1inputString").val($(liarr[j1cus]).html())
            $("#j1inputString1").val($(liarr[j1cus]).html())
            $("#pinfo").html($(liarr[j1cus]).attr("pcontent"))
            $("#info_linkid").val($(liarr[j1cus]).attr("placeid"))
            $("#endcityid").val($(liarr[j1cus]).attr("placeid"))
            $("#info_title").val($(liarr[j1cus]).attr("pname"))
            $("#endcity").val($(liarr[j1cus]).attr("pname"))
            $("#j1inputString").focus();
            j1cus=-1;
        }
    }
</script>
<div class="content">
    <div class="panel panel-default panel-intro">
    <div class="panel-body">
    <form id="add-form" class="form-horizontal nice-validator n-default n-bootstrap" role="form" data-toggle="validator" method="POST" action="" novalidate="novalidate">
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">产品名称:</label>
            <div class="col-xs-12 col-sm-8 "  style="margin-top:9px;">
                <span>{$res.s_name}</span>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">层级类别:</label>
            <div class="col-xs-12 col-sm-8"  style="margin-top:9px;">
                <span>{$pptype[$type]}</span>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">显示标题:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="ptitle" class="form-control" name="ptitle" value="" type="text" style="width:400px;">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">状态:</label>
            <div class="col-xs-12 col-sm-8">
                <input  name="status"  value="1" type="radio" checked="checked">正常
                <input  name="status"  value="2" type="radio">下线
            </div>
        </div>
        {if condition="$type eq 1"}
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">选择类型:</label>
            <div class="col-xs-12 col-sm-8">
                <input  name="selecttype"  value="1" type="radio" checked="checked">多选
                <input  name="selecttype"  value="2" type="radio">单选
            </div>
        </div>
        {/if}
        {if condition="$type eq 2"}
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">开始城市:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="startcity" class="form-control" name="startcity" type="text" readonly="readonly">
                <input id="startcityid" class="form-control" name="startcityid" type="hidden">
                选择城市 <input type="text" size="30" value="" id="inputString" onfocus="lookup(this.value);" onkeyup="lookup(this.value);" onblur="fill1();"  onkeydown="sitem(event,this)" autocomplete="off"/>
                <div style="width: 0px; height: 0px; overflow: hidden"><input  type="text" size="30" value="" id="inputString1" onkeydown="sitem(event,this)" onblur="fill1();" autocomplete="off"/></div>
                <div class="suggestionsBox" id="suggestions" style="display: none;">
                    <div class="suggestionList" id="autoSuggestionsList">
                        &nbsp;
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">结束城市:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="endcity" class="form-control" name="endcity" type="text" readonly="readonly">
                <input id="endcityid" class="form-control" name="endcityid" type="hidden">
                选择城市 <input type="text" size="30" value="" id="j1inputString" onfocus="j1lookup(this.value);" onkeyup="j1lookup(this.value);" onblur="j1fill1();"  onkeydown="j1sitem(event,this)" autocomplete="off"/>
                <div style="width: 0px; height: 0px; overflow: hidden"><input  type="text" size="30" value="" id="j1inputString1" onkeydown="j1sitem(event,this)" onblur="j1fill1();" autocomplete="off"/></div>
                <div class="j1suggestionsBox" id="j1suggestions" style="display: none;">
                    <div class="j1suggestionList" id="j1autoSuggestionsList">
                        &nbsp;
                    </div>
                </div>
            </div>
        </div>
        {/if}
        <div class="form-group layer-footer">
            <label class="control-label col-xs-12 col-sm-2"></label>
            <div class="col-xs-12 col-sm-8">
                <button type="button" class="btn btn-success btn-embossed" onclick="sub();">确定</button>
                <a href="/admin/product/product_package?pid={$pid}&fid={$fid}" class="btn btn-default btn-embossed">返回</a>
            </div>
        </div>
    </form>
</div>
</div>
</div>
<script language="javascript" type="text/javascript" src="/assets/My97DatePicker/jquery-1.8.2.js"></script>
<script>
    function sub(){
         var title=$("#ptitle").val();
         if(title==''){
             alert("标题不得为空");
             return;
         }
         $("#add-form").submit();
    }
</script>
